import React from "./react"
import ReactDOM from "./react-dom"
import Button from "./components/button"
// import Component from "./react/component"
const ele =(
    <div className="active" title="123">
        你好
        <span>react</span>
        <div className="box">
            <span>测试</span>
        </div>
    </div>
)

// function Home(){
//     return (
//         <div className="active" title="123">
//             你好
//             <span>react</span>
//             <p>hahhahhah</p>
//             <button>洗澡</button>
//         </div>
//     )
// }
class Home extends React.Component{
    constructor(props){
        super(props);
        this.state={
            number:0
        }
    }
    componentWillMount(){
        console.log('组件将要加载');
    }
    componentWillReceiveProps(props){
        console.log(props,'属性更新')
    }
    componentWillUpdate(){
        console.log('组件将要更新');
    }
    componentDidUpdate(){
        console.log('组件更新完成');
    }
    componentDidMount(){
        console.log('组件加载完成');
    }
    handleClick(){
        this.setState({
            number:this.state.number + 1
        })
    }
    render(){
        const {number} = this.state
        return (
            <div className="active" title="123">
                你好
                <span>react </span>
                <div>{number}</div>
                <p>hahhahhah</p>
                <button onClick={()=>this.handleClick()}>洗澡</button>
                <button>anniu</button>
                {/* <Button name={"hahah"} /> */}
            </div>
        )
    }
}
// console.log(<Home title="name"/>)
// ReactDOM.render(ele,document.querySelector("#root"));
ReactDOM.render(<Home title="name"/>,document.querySelector("#root"));